<template>
    <div class="name-box">
        <el-input v-model="myId" v-show="myShow == true"></el-input>
        <el-input v-model="name" placeholder="名称"></el-input>
        <el-checkbox v-model="display">显示</el-checkbox>
        <div class="saveCancel">
            <el-button type="primary" size="small " @click="temManaSave">保存</el-button>
            <el-button type="info" plain size="small" @click="myCancel">取消</el-button>

        </div>
    </div>
</template>

<script>
export default {
    name: "nameBox",
    data() {
        return {
            name: "",
            display: false,
            addTemp:true,
            children: [],
            myShow: false,
            myId:undefined,
        }
    },
    methods: {
        temManaSave() {
            console.log(this.myId);
            
            if (this.myId ==undefined) {
                this.$store.dispatch("addTemManaSave", { name: this.name, display: this.display, children: this.children,addTemp:this.addTemp})
   
            }else{
            
                this.$store.dispatch("reviseTemManaSave", { id:this. myId,name: this.name, display: this.display})
                
            }
            this.$router.push("/temManage")

            


        },
        myCancel() {
            this.$router.push("/temManage")
        }

    },
    created() {
    if(this.$route.params.row!=undefined){
        console.log(this.$route.params.row);
        let id = this.$route.params.row;
        this.myId = id;
        let data = this.$store.state.workFlow.templateMana
        for (let i = 0; i < data.length; i++) {
            if (id == data[i].id) {
                this.name = data[i].name;
                this.display = data[i].display;
            }
        }

    }else{
        
    }
       
    }

}
</script>


<style scoped>
.name-box {
    display: flex;
    flex-direction: column;
    padding: 10px 0px;
    border-top: 1px solid#d2d6de;
    border-bottom: 1px solid #d2d6de;
    margin: 10px 0px;
    background-color: white;


}

.saveCancel {
    margin-top: 10px;
}
</style>